{include file="public/head"/}
    <div class="container-fluid"  id="main">
        <div class="row clearfix" id="search-box" style="margin-top:0">
            <div class="col-md-12 column text-right">
                <div class="form-inline" style="text-align: right;">
                      <div class="input-group">
                        <div class="input-group-btn">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">{{catecontent}}
                            <span class="caret" style="margin-left:10px"></span>
                            </button>
                            <ul class="dropdown-menu" style="max-height: 300px;overflow: auto;">
                                <li  @click="cateDataChange('','产品分类',0)"><a href="#">产品分类</a></li>
                                <li v-for="(item,index) in cateList" @click="cateDataChange(item.id,item.content,0)"><a href="#" :style="{'padding-left':36+(item.level*20)+'px'}" >{{item.content}}</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="form-group">
                        <input type="text" class="form-control" id="name" placeholder="{:strtoupper(lang('enter_product_name,_code_or_model'))}" @change="putFun" v-model="searchText">
                      </div>
                      <div class="form-group">
                          <button type="button" class="btn btn-default" @click="requestSearch"><span class="glyphicon glyphicon-search"></span> {:strtoupper(lang('search'))}</button>
                      </div>
                </div>
            </div>
        </div>
      <div class="row clearfix">
        <div class="col-md-12 column">
          <div class="alert alert-dismissable alert-info">
            <button type="button" class="close">×</button>
             <p></p>
            </div>
        </div>
       </div>
      <div class="ntDesktop">
      <div class="ntDesktop-head">{:strtoupper(lang("product_list"))}</div>    
        <div class="row clearfix" style="padding-top:12px">
          <div class="col-md-6 column">
              <ul class="nav nav-tabs">
                  <li v-if="isshow_search" class="active">
                      <a href="#home" data-toggle="tab" class="ptlang"
                      >搜索结果<span class="glyphicon glyphicon-remove shdow" style="margin-left: 10px;" @click="shdow()"></span></a>
                  </li>
                  <li :class="{'active':listStatus==9 && !isshow_search}">
                      <a href="#home" data-toggle="tab" id="list-all" @click="listStatusFun(9)">{:strtoupper(lang('all'))}</a>
                  </li>
                  <li  :class="{'active':listStatus==1 && !isshow_search}">
                      <a href="#home" data-toggle="tab" id="list-normal" @click="listStatusFun(1)">{:strtoupper(lang('normal'))}</a>
                  </li>
                  <li  :class="{'active':listStatus==4 && !isshow_search}">
                      <a href="#home" data-toggle="tab" id="list-pulloff" @click="listStatusFun(4)">{:strtoupper(lang("off_the_shelf"))}</a>
                  </li>
                  <li  :class="{'active':listStatus==2 && !isshow_search}">
                      <a href="#home" data-toggle="tab" id="list-del" @click="listStatusFun(2)">{:strtoupper(lang('delete'))}</a>
                  </li>
              </ul>
          </div>
          <div class="col-md-6 column text-right">
              <div>
                  <div class="input-group-btn" style="float: left;">
                      <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">{{catecontent}}
                      <span class="caret" style="margin-left:10px"></span>
                      </button>
                      <ul class="dropdown-menu" style="max-height: 300px;overflow: auto;">
                          <li @click="cateDataChange('','产品分类',1)"><a href="#">产品分类</a></li>
                          <li v-for="(item,index) in cateList" @click="cateDataChange(item.id,item.content,1)"><a href="#" :style="{'padding-left':36+(item.level*20)+'px'}" >{{item.content}}</a></li>
                      </ul>
                  </div>
                  <a href="{:url('product/productAdd')}" @click="setStorage" class="btn btn-primary"  v-if="auth_ids.indexOf(123) != -1">
                    <span class="glyphicon glyphicon-plus"></span> {:strtoupper(lang("add_products"))}
                  </a>
                  <span style="padding:10px">&nbsp;</span>
                  <!-- <button type="button" class="btn btn-default" ><span class="glyphicon glyphicon-list-alt"></span> {:lang('batch_adjustment')}</button> -->
                  <button type="button" class="btn btn-default option-pulloff" @click="batchfun(4,'update','batchObtained')" v-if="listStatus !=4 && listStatus !=2 && auth_ids.indexOf(131) != -1">
                    <span class="glyphicon glyphicon-minus-sign"></span> {:strtoupper(lang("delisted_in_bulk"))}
                  </button>
                  <button type="button" class="btn btn-default option-del" @click="batchfun(2,'update','batchDel')" v-if="listStatus !=4 && listStatus !=2 && auth_ids.indexOf(130) != -1">
                      <span class="glyphicon glyphicon-remove-circle"></span> {:strtoupper(lang('batch_delete'))}
                  </button>
                  <button type="button" class="btn btn-default option-recover" @click="batchfun(1,'update','batchRestore')" v-if="listStatus !=1 && auth_ids.indexOf(132) != -1">
                    <span class="glyphicon glyphicon-ok-circle"></span> {:strtoupper(lang('batch_recovery'))}
                  </button>
                  <button type="button" class="btn btn-danger option-clear" @click="batchfun(5,'deletes','batchClear')" v-if="listStatus ==2 && auth_ids.indexOf(133) != -1">
                    <span class="glyphicon glyphicon-fire"></span> {:strtoupper(lang('batch_clear'))}
                  </button>
              </div>
          </div>
        </div>
       
      <div class="row clearfix">
        <div class="col-md-12 column">
          <input type="hidden" ref="waner" value="{:strtoupper(lang('please_select_product'))}">
          <table class="table table-striped table-hover ntTable">
            <thead>
            <tr>
                <th style="text-align: center;"><input type="checkbox" @click="allsel" /> </th>
                <th>&nbsp;  </th>
                <th> {:strtoupper(lang('serial_number'))} / {:strtoupper(lang("brand"))} / {:strtoupper(lang('name'))} </th>
                <th> {:strtoupper(lang("the_role_of_product"))} </th>
                <th> 是否可售 </th>
                <th> {:strtoupper(lang('status'))} </th>
                <th> {:strtoupper(lang('edit'))} </th>
                <th style="text-align: center;"> {:strtoupper(lang('operate'))} </th>
                </tr>
            </thead>
            <tbody>
              <tr v-for="(item,index) in datalist" v-cloak>
                <td style="text-align: center;"><input type="checkbox"  @click="onesel(item.id)" /></td>
                <td><a :href="'/admin/product/productDetail?request=detail&id='+item.id"> <img :src="item.img_url" border="0" width="50px" height="50px"> </a> </td>
                <td v-if="item.isPro"><a :href="'/admin/product/productDetail?request=detail&id='+item.id" title="{:strtoupper(lang('product'))}"> <small>{{formatUnit(item.id,'ID')}}  {{item.brand_name ? ' / '+item.brand_name : ''}}</small> <br />{{item.pro_name}} </a></td>
                <td v-else><a :href="'/admin/product/productDetail?request=detail&id='+item.id" title="{:strtoupper(lang('the_role_of_product'))}"> <small>{{item.prochar_id + ' / ' + (item.brand == '' ? '' : item.brand +' / ') + (item.model==''?'':item.model) + ( item.featureName == '' ? '' :' / '+item.featureName)}}</small> <br />{{item.pro_name}} </a></td>


                <td class="text-right">{{item.product_role_count}}</td>
                <td style="text-align: center;"> {{item.is_sale}}</td>
                <td> {{item.status_name}}</td>
                <td>{{item.create_name}}<br /><small>{{item.create_at}}</small></td>
                <td  style="text-align: right;">
                    <div>
                      <a :href="'/admin/product/list_open?request=return&id='+item.id" class='btn btn-sm btn-primary' data-toggle="modal" data-target="#prosModal" v-if="auth_ids.indexOf(124) != -1">
                        <span class="glyphicon glyphicon-modal-window"></span> {:strtoupper(lang('summary'))}
                      </a>
                      <a :href="'/admin/product/productDetail?request=detail&id='+item.id" class='btn btn-sm btn-primary' v-if="auth_ids.indexOf(125) != -1">
                        <span class="glyphicon glyphicon-sunglasses"></span> {:strtoupper(lang('details'))}
                      </a>
                      <a :href="'/admin/product/productEdit?request=edit&id='+item.id" class='btn btn-sm btn-primary'  @click="setStorage" v-if="auth_ids.indexOf(126) != -1">
                        <span class="glyphicon glyphicon-pencil"></span> {:strtoupper(lang('edit'))}
                      </a>
                      <a :href="'/admin/product/proCopy?request=return&id='+item.id" class='btn btn-sm btn-primary' data-toggle="modal" data-target="#prosCopy" v-if="auth_ids.indexOf(362) != -1">
                        <span class="fa fa-copy"></span> {:strtoupper(lang('copy'))}
                      </a>
                      <a href="javascript:;" class='btn btn-sm btn-default option-pulloff' v-show="item.status!='4'" @click="requestStatus(item.id,'update',4,'batchObtained')" v-if="auth_ids.indexOf(129) != -1">
                        <span class="glyphicon glyphicon-download"></span> {:strtoupper(lang("off_the_shelf"))}
                      </a>
                      <a href="javascript:;" class='btn btn-sm btn-default option-del' v-show="item.status!='2'" @click="requestStatus(item.id,'update',2,'batchDel')" v-if="auth_ids.indexOf(128) != -1">
                        <span class="glyphicon glyphicon-remove"></span> {:strtoupper(lang('delete'))}
                      </a>

                      <a href="javascript:;" class='btn btn-sm btn-default option-recover' v-show="item.status!='1'" @click="requestStatus(item.id,'update',1,'batchRestore')" v-if="auth_ids.indexOf(134) != -1">
                        <span class="glyphicon glyphicon-ok"></span> {:strtoupper(lang('recovery'))}
                      </a>
                      <a href="javascript:;" class='btn btn-sm btn-danger option-clear' v-show="item.status=='2'" @click="requestStatus(item.id,'deletes',9,'batchClear')" v-if="auth_ids.indexOf(135) != -1">
                        <span class="glyphicon glyphicon-fire"></span> {:strtoupper(lang('clear'))}
                      </a>
                    </div>
                </td>
              </tr>
              <tr style="text-align: center;" v-if="datalist.length==0">
                    <td colspan="8" class="no_date">{:lang('no_data')}</td>
                </tr>
            </tbody>
          </table>
            <ul class="pagination" id="pagination" v-show="datalist.length!=0">
            </ul>
        </div>
          </div>
      </div>
    </div>
    <!--弹窗部分 开始-->    
<div class="modal fade" id="prosModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="width:1200px;">
        <div class="modal-content" style="width: 1200px;">
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div> 


<!--弹窗产品复制 -->
<div class="modal fade" id="prosCopy" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"  data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog" style="width: 1200px;" >
        <div class="modal-content" style="width: 1200px;">

        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<script src="/static/Admin/js/prolist.js"></script>
{include file="public/foot"/}